import { useTranslation } from "react-i18next";
import { BasicTable, useTable, FormSchema, BasicColumn } from "@/components/Table";
import PatientInformation from "@/components/ViewComponents/PatientInformation";

const UseHooks = () => {
	const { t } = useTranslation();

	const searchFormSchema: FormSchema[] = [
		{
			label: t("MedicalRecords.recordStorage.date_from"),
			field: "date_from",
			component: "DatePicker"
		},
		{
			label: t("MedicalRecords.recordStorage.date_to"),
			field: "date_to",
			component: "DatePicker"
		},
		{
			label: t("MedicalRecords.recordStorage.no_archived"),
			field: "Not Returned",
			component: "Checkbox"
		},
		{
			label: t("MedicalRecords.recordStorage.dept_name"),
			field: "dept_name",
			component: "Select"
		},
		{
			label: t("MedicalRecords.recordStorage.no_archived"),
			field: "no_archived",
			component: "Input"
		},
		{
			label: t("MedicalRecords.recordStorage.pat_code"),
			field: "pat_code",
			component: "Input"
		},
		{
			label: t("MedicalRecords.recordStorage.full_name"),
			field: "full_name",
			component: "Input"
		},
		{
			label: t("MedicalRecords.recordStorage.death_count"),
			field: "death_count",
			component: "Input"
		},
		{
			label: t("MedicalRecords.recordStorage.ICD"),
			field: "ICD",
			component: "Input"
		}
	];
	const columns: BasicColumn[] = [
		{
			title: t("MedicalRecords.recordStorage.dept_name"),
			dataIndex: "dept_name"
		},
		{
			title: t("MedicalRecords.recordStorage.no_archived"),
			dataIndex: "no_archived"
		},
		{
			title: t("MedicalRecords.recordStorage.death_count"),
			dataIndex: "death_count"
		},
		{
			title: t("MedicalRecords.recordStorage.pat_code"),
			dataIndex: "pat_code"
		},
		{
			title: t("MedicalRecords.recordStorage.full_name"),
			dataIndex: "full_name"
		},
		{
			title: t("MedicalRecords.recordStorage.birthday"),
			dataIndex: "birthday"
		},
		{
			title: t("MedicalRecords.recordStorage.address"),
			dataIndex: "address"
		},
		{
			title: t("MedicalRecords.recordStorage.admission_number"),
			dataIndex: "admission_number"
		},
		{
			title: t("MedicalRecords.recordStorage.pat_type"),
			dataIndex: "pat_type"
		},
		{
			title: t("MedicalRecords.recordStorage.object"),
			dataIndex: "trtmt_object"
		},
		{
			title: t("MedicalRecords.recordStorage.officer"),
			dataIndex: "officer"
		},
		{
			title: t("MedicalRecords.recordStorage.hi_code"),
			dataIndex: "hi_code"
		},
		{
			title: t("MedicalRecords.recordStorage.date_admission"),
			dataIndex: "date_admission"
		},
		{
			title: t("MedicalRecords.recordStorage.date_discharge"),
			dataIndex: "date_discharge"
		},
		{
			title: t("MedicalRecords.recordStorage.ICD"),
			dataIndex: "ICD"
		}
	];
	const dataSource = [
		{
			dept_name: "dept_name",
			no_archived: "no_archived",
			death_count: "death_count",
			pat_code: "pat_code",
			full_name: "full_name",
			birthday: "birthday",
			ad_numb: "ad_numb",
			pat_type: "pat_type",
			trtmt_object: "trtmt_object",
			officer: "officer",
			hi_code: "hi_code",
			date_admission: "date_admission",
			date_discharge: "date_discharge",
			ICD: "ICD Code"
		}
	];
	const [registerTable] = useTable({
		dataSource: dataSource,
		columns,
		formConfig: {
			labelWidth: 150,
			schemas: searchFormSchema,
			baseColProps: { span: 6 },
			showActionButtonGroup: true
		},
		useSearchForm: true
	});

	return (
		<div className="query-page">
			<div className="page-content">
				<div className="block">
					<PatientInformation isSearch={true}></PatientInformation>
				</div>
				<div className="block mt-2">
					<div className="block-label" style={{ marginBottom: 0 }}>
						Ⅱ.Patient Record Search
					</div>
					<BasicTable register={registerTable}></BasicTable>
				</div>
			</div>
		</div>
	);
};

export default UseHooks;
